<template>
  <div>
    <h3>陈帅鹏黑店</h3>
    <FatherCom
      v-for="item in list"
      :key="item.id"
      :message="item"
      :id="item.id"
      @minus="minus"
    ></FatherCom>
    <!-- @后面的名字要和子组件里$emit里的参数1一样  父组件里的事件函数名写在methods里 形参接受的是子组件传过来的值-->
  </div>
</template>

<script>
import FatherCom from "./components/FatherCom";
export default {
  data() {
    return {
      list: [
        {
          id: 1,
          proname: "超级好吃棒棒糖",
          proprice: 188,
          low: 160,
          desc: "甜",
        },
        {
          id: 2,
          proname: "超级好吃的大鸡腿",
          proprice: 360,
          low: 320,
          desc: "香",
        },
        { id: 3, proname: "超级无敌冰激凌", proprice: 42, low: 30, desc: "冰" },
      ],
    };
  },
  methods: {
    //我们可以通过id去确定当前点击的是哪一项
    minus(id, num) {
      this.list.forEach((item) => {
        if (item.id === id) {
          item.proprice > item.low ? item.proprice -= num : alert('破产了')
        }
      });
    },
  },

  components: {
    FatherCom,
  },
};
</script>

<style></style>
